import React from 'react';
import { ConfigProvider, Layout } from 'antd';
import zhCN from 'antd/locale/zh_CN';
import 'dayjs/locale/zh-cn';
import HeaderLayout from '../../components/HeaderLayout';
import SiderLayout from '../../components/SiderLayout';
import RouterView from '../../views/RouterView';
import './index.css';

const { Sider, Content } = Layout;

const App: React.FC = () => {
  return (
    <ConfigProvider
      locale={zhCN}
      theme={{
        components: {
          Layout: {
            headerBg: '#ffffff',
            headerColor: 'rgba(0, 0, 0, 0.88)',
            siderBg: '#ffffff'
          }
        }
      }}
    >
      <Layout>
        <HeaderLayout />
        <Layout>
          <Sider
            width={200}
            className="app-sider"
          >
            <SiderLayout />
          </Sider>
          <Content className="app-content">
            <RouterView />
          </Content>
        </Layout>
      </Layout>
    </ConfigProvider>
  );
};

export default App;
